<template>
  <div>
    <van-nav-bar fixed title="消息管理"></van-nav-bar>
    <div class="list-area">
      <van-list v-model="loading" :finished="finished" @load="querylist" finished-text="没有更多了">
        <van-row class="message-row" v-for="(item,idx) in source" :key="idx">
          <van-cell>
            <van-col :span="24">标题：{{item.subject}}</van-col>
            <van-col :span="24">发送人：{{item.sender}}</van-col>
            <van-col :span="24">内容：{{item.text}}</van-col>
          </van-cell>
        </van-row>
      </van-list>
    </div>
    <tabbar />
  </div>
</template>
<script>
import tabbar from "@/components/tabbar.vue";
export default {
  data() {
    return {
      loading: false,
      list: [],
      source: [],
      finished: true,
      page: 1,
      size: 10,
      keyword: ""
    };
  },
  components: { tabbar },
  mounted() {
    this.querylist();
  },
  methods: {
    querylist: function() {
      let _that = this;
      this.$ajax
        .get("/message")
        .then(res => {
          if (res.data) {
            _that.source = res.data.reverse();
          }
        })
        .catch(function(error) {
          console.log(error);
        });
    }
  }
};
</script>
<style>
.message-row {
  border-bottom: 1px solid #eee;
  background: #ccc;
}
</style>